import 'package:card_swiper/card_swiper.dart';
import 'package:flutter/material.dart';

class Home extends StatelessWidget {
  const Home({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("SingleChildScrollView Demo"),
        actions: [IconButton(onPressed: () {}, icon: Icon(Icons.share))],
      ),
      body: SwiperDemo(),
    );
  }
}

class SwiperDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    List imgs = [
      'images/kjj_guide_01.png',
      'images/kjj_guide_02.png',
      'images/kjj_guide_03.png'
    ];

    return ListView(
      children: [
        Container(
          height: 200,
          child: Swiper(
            itemCount: imgs.length,
            itemBuilder: (context, index) {
              return Image.asset(
                imgs[index],
                fit: BoxFit.fill,
              );
            },
            viewportFraction: 0.8,
            scale: 0.9,
            pagination: SwiperPagination(
              alignment: Alignment.bottomRight
            ),
          ),
        ),
        Container(
          height: 200,
          child: Swiper(
            itemWidth: 300,
            itemHeight: 200,
            itemCount: imgs.length,
            itemBuilder: (context, index) {
              return Image.asset(
                imgs[index],
                fit: BoxFit.fitHeight,
              );
            },
            viewportFraction: 0.8,
            scale: 0.9,
            //指示原点 在内部还是外部
            outer: true,
            pagination: SwiperPagination(
              alignment: Alignment.bottomRight,
              margin: EdgeInsets.all(5),
              builder: DotSwiperPaginationBuilder(
                color: Colors.redAccent,
                activeColor: Colors.blueAccent,
                size: 10.0,
                activeSize: 10.0
              )
            ),
          ),
        ),
        Container(
          height: 200,
          child: Swiper(
            itemWidth: 300,
            itemHeight: 200,
            itemCount: imgs.length,
            itemBuilder: (context, index) {
              return Image.asset(
                imgs[index],
                fit: BoxFit.scaleDown,
              );
            },
            // viewportFraction: 0.8,
            // scale: 0.9,
            layout: SwiperLayout.STACK,
            outer: true,
            pagination: SwiperPagination(
              alignment: Alignment.bottomRight,
              margin: EdgeInsets.all(10),
              builder: RectSwiperPaginationBuilder(
                color: Colors.white,
                activeColor: Colors.blueAccent,
                size: Size(10, 15),
                activeSize: Size(10, 15)
              )
            ),
          ),
        ),
      ],
    );
  }
}
